<template>
  <el-form size="small" label-width="90px">
    <el-form-item label="开启" >
      <el-switch v-model="activeData.isDecision" />
    </el-form-item>
    <template v-if="activeData.isDecision">
      <el-form-item label="主提示语" >
        <el-input type="textarea" :rows="2" v-model="activeData.promptTemplate" placeholder="请输入提示语模板" />
        <div>可用变量：</div>
        <div>成功的条数: ${successCount}</div>
        <div>失败的条数: ${failCount}</div>
      </el-form-item>
      <el-divider>行提示语设置</el-divider>
      <div :gutter="15" v-for="(item, index) in activeData.condition" :key="index">
        <el-row :gutter="15">
          <el-col :span="20">        
            <el-form-item label="提示语" >
              <el-input v-model="item.warningTemplate" placeholder="请输入提示语" />
            </el-form-item>
            <el-form-item label="条件类型" >
              <el-select v-model="item.comparisonType" placeholder="选择条件类型" clearable :style="{width: '100%'}">
                <el-option key="SQL" label="SQL查询" value="SQL" />
                <el-option key="CONDITION" label="条件匹配" value="CONDITION" />
              </el-select>
            </el-form-item>
            <el-form-item label="条件值" >
              <el-input type="textarea" :rows="2" v-model="item.comparisonValue" placeholder="请输入提示语模板" />
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-button type="danger" size="mini" icon="el-icon-delete" circle @click="handleRemove(index)"></el-button>
          </el-col>
        </el-row>
        <el-divider></el-divider>
      </div>
      <div style="text-align: center; margin-top: 15px;">
        <el-button
          style="padding-bottom: 0"
          icon="el-icon-circle-plus-outline"
          type="text"
          @click="addConditionItem">
          添加条件
        </el-button>
      </div>
    </template>
  </el-form>
</template>

<script>

export default {
  components: {
    
  },
  props: {
    activeData: Object
  },
  data() {
    return {

    }
  },
  computed: {

  },
  watch: {
  },
  created() {

  },
  methods: {
    addConditionItem() {
      this.activeData.condition = this.activeData.condition || []
      const item = {
        comparisonType: '',
        comparisonValue: '',
        warningTemplate: ''
      }
      this.activeData.condition.push(item)
    },
    handleRemove(index) {
      this.activeData.condition.splice(index, 1)
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
